<template>
    <div>
        <cu-navbar>
            <block slot="content">换购</block>
        </cu-navbar>
        <view class="userinfo-page page">
            <u-form labelPosition="left" labelWidth="160rpx"  ref="form1">
                <u-form-item label="银行账户名" prop="userInfo.bank_username" borderBottom ref="item1">
                    <u-input placeholder="请输入银行账户号" v-model="formData.bank_name" ></u-input>
                    <div class="button f-s" @click="copy(formData.bank_name)">复制</div>
                </u-form-item>
                <u-form-item label="开户分行" prop="userInfo.bank_name" borderBottom ref="item1">
                    <u-input placeholder="请输入开户分行" v-model="formData.bank_kname" ></u-input>
                    <div class="button f-s" @click="copy(formData.bank_name)">复制</div>
            
                </u-form-item>
                <u-form-item label="银行卡号" prop="userInfo.bank_no" borderBottom ref="item1">
                    <u-input placeholder="请输入银行卡号" v-model="formData.bank_num" ></u-input>
                    <div class="button f-s" @click="copy(formData.bank_num)">复制</div>
            
                </u-form-item>
                <u-form-item label="姓名" prop="userInfo.bank_no" borderBottom ref="item1">
                    <u-input placeholder="请输入银行卡姓名" v-model="formData.bank_username" ></u-input>
                    <div class="button f-s" @click="copy(formData.bank_username)">复制</div>
                </u-form-item>
                <u-form-item label="支付凭证" prop="userInfo.alpay_no" borderBottom ref="item1">
                    <u-upload
                        @on-success="uploadAlipic"
                        @on-remove="removeAlipic"
                        name="file"
                        :action="action"
                        :max-count="1" :header="header" :file-list="aliPicList" ></u-upload>
                </u-form-item>
            </u-form>
        
            <div class="submit" @click="submit">保存</div>
        </view>
    </div>
</template>

<script>
	import userInfo from "../../mixins/userInfo";
  import { API_URL } from '../../env.js'

  export default {
      mixins: [userInfo],
		data() {
			return {
          action: `${API_URL}index.php/api/common/upload`,
          header: {
              token: uni.getStorageSync("token"),
          },
				seconds: 60,
          smscode: '',
          aliPicList: [],
          weixinpicList: [],
          avatarList: [],
          tips: '',
          formData: {

          },
        order_id: ''
      }
		},
    onLoad(e) {
        this.order_id = e.orderId
        this.$api.getAccount().then(res => {
          this.formData = {
            ...res.result,
            img: ''
          }
        })
    },
		methods: {
      copy(data) {
        uni.setClipboardData({
          //去找上面的数据
          data,
          success: function (res) {
            uni.showToast({
              title: "复制成功",
            });
          },
          fail: function (res) {
            console.log(res);
          },
        });
      },
      uploadAlipic(e) {
        this.formData.img = e.result.fullurl
      },
      removeAlipic() {
        this.formData.img = ''
      },
      submit() {
        if (!this.formData.img) return this.$common.errorToShow('支付凭证不能为空')

        this.$api.chaifen({
          order_id: this.order_id,
          img: this.formData.img
        }).then(res => {
          if (res.code == 1) {
            setTimeout(() => {
              uni.showToast({
                icon: 'none',
                title: res.reason
              })
              uni.navigateBack()
            },300)
          }
        })
      }
		}
	}
</script>

<style lang="scss">
	.userinfo-page {
		min-height: 100%;
		background-color: #fff !important;
		padding: 0 20rpx;
      padding-bottom: 50px;
    .button {
      width: 50px;
      height: 27px;
      line-height: 27px;
      text-align: center;
      background: #ff443b;
      border-radius: 4px;
      font-size: 13px;
      font-weight: 400;
      color: #fff;
      margin-left: 10px;
    }
	}
</style>
